.index-wrap{
  // padding: 20rpx ;
  .swiper-panner{
    width: 100%;
    /* 300你的图片的高度, 750你的图片的宽度 ,100vw为显示屏幕的宽度*/
     height: calc(100vw * 300 / 750);
     .img{
      width: 100%;
    }
    .wx-swiper-dot{
      background-color: rgb(243, 235, 235);
    }
    .wx-swiper-dot-active{
      background-color: #ff8f00;; 
    }
  }
  .scrollarea{
    box-sizing: border-box;
    padding: 20rpx 20rpx 20rpx 20rpx;
    .cate-swiper{
      // height: 400rpx;
      margin-top: 20rpx;
      .cate-list{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        .item{
          display: flex;
          flex-direction: column;
          align-items: center;
          width: 25%;
          margin-bottom: 20rpx;
          .img{
            width: 80rpx;
            height: 80rpx;
          }
          .name{
            font-size: 14px;
          }
        }
      }
      .wx-swiper-dot{
        background-color: rgb(243, 235, 235);
      }
      .wx-swiper-dot-active{
        background-color: #ff8f00;; 
      }
  
    }
    .cate-region{
      .custom-tab-title{
        .van-ellipsis{
          // font-size: 16px;
          // &::after{
          //   width: 20rpx;
          //   height: 20rpx;
          //   content: '';
          //   background: transparent;
          //   position: absolute;
          //   left: 20rpx;
          //   top: 50%;
          //   transform: translateY(-50%);
          //   background-color: blue;
          // }
        }
      }
      .nav-card{
        display: flex;
        min-height: 100rpx;
        flex-wrap: wrap;
        margin-top: 20rpx;
        padding: 30rpx 0rpx;
        border: 1rpx solid rgb(218, 211, 211);
        .item{
          width: 25%;
          font-size: 14px;
          text-align: center;
          padding: 8rpx 0;
        }
      }
  
    }
    .reservation{
      padding: 20rpx;
      margin-top: 30rpx;
      border: 1rpx solid rgb(218, 211, 211);
      .title{
        font-size: 16px;
        font-weight: bold;
      }
      .item{
        padding: 40rpx 20rpx;
        margin-top: 20rpx;
        border: 1rpx solid rgb(218, 211, 211);
        font-size: 16px;
        .label{
          font-weight: bold;
        }
        
      }
      .select-adress{
        display: flex;
        .cont{
          margin-top: 10rpx;
        }
        .left-content{
          flex: 1;
        }
      }
      .select-service{
        display: flex;
        justify-content: space-between;
        padding: 50rpx 20rpx;
        .cont{
          font-size: 15px;
        }
      }
      
    }
    .ctr-btn{
      width: 100%;
      height: 80rpx;
      line-height: 80rpx;
      margin-top: 20rpx;
      margin-bottom: 20rpx;
      font-size: 14px;
      border-radius: 8rpx;
      text-align: center;
      background-color: rgb(255, 143, 0);
    }
    .repair{
      padding: 20rpx;
      margin-top: 30rpx;
      border: 1rpx solid rgb(218, 211, 211);
      .title{
        font-size: 16px;
        font-weight: bold;
      }
      .content{
        display: flex;
        justify-content: space-between;
        .item{
          width: 34%;
          font-size: 16px;
          text-align: center;
          padding: 52rpx 40rpx;
          margin-top: 20rpx;
          border: 1rpx solid rgb(218, 211, 211);
        }
        .know{
          background-color: rgba(18, 7, 223, 0.59);
        }
        .answer{
          background-color: rgba(68, 0, 119, 0.2);
        }
      }
    }

  }
  .location{
    display: flex;
    align-items: center;
    font-size: 14px;
    .img{
      width: 32rpx;
      height: 32rpx;
    }
  }
}